.perfundo__overlay {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  visibility: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: rgba(0, 0, 0, .9)
}

.perfundo__overlay.is-active,
.perfundo__overlay:target {
  visibility: visible
}

.perfundo__content {
  max-height: 100%;
  overflow: auto
}

.is-active>.perfundo__content,
:target>.perfundo__content {
  -webkit-animation: .4s ease-out .2s both;
  animation: .4s ease-out .2s both;
  -webkit-animation-name: inherit;
  animation-name: inherit
}

.perfundo__html {
  padding: 2em;
  max-width: 42em;
  background-color: #fff
}

.perfundo__figure {
  display: none;
  margin: 1.5em
}

.is-active>.perfundo__figure,
:target>.perfundo__figure {
  display: block
}

.perfundo__figure img {
  display: block;
  height: 0
}

.perfundo__figcaption {
  color: #fff
}

.perfundo__image {
  max-width: 100%;
  background-size: 100%
}

.perfundo__control {
  position: absolute;
  width: 3em;
  height: 3em;
  background-position: center center;
  background-size: cover;
  text-indent: -999em
}

.perfundo__close {
  top: 1em;
  right: 1em;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20viewBox%3D%220%200%2032%2032%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M21.7%2010.3c-0.4-0.4-1-0.4-1.4%200l-4.3%204.3-4.2-4.2c-0.4-0.4-1-0.4-1.4%200-0.4%200.4-0.4%201%200%201.4l4.2%204.2-4.3%204.3c-0.4%200.4-0.4%201%200%201.4%200.4%200.4%201%200.4%201.4%200l4.3-4.3%204.2%204.2c0.4%200.4%201%200.4%201.4%200%200.4-0.4%200.4-1%200-1.4l-4.2-4.2%204.3-4.3C22.1%2011.3%2022.1%2010.7%2021.7%2010.3zM16%200C7.2%200%200%207.2%200%2016s7.2%2016%2016%2016c8.8%200%2016-7.2%2016-16S24.8%200%2016%200zM16%2030C8.3%2030%202%2023.7%202%2016S8.3%202%2016%202s14%206.3%2014%2014S23.7%2030%2016%2030z%22%2F%3E%3C%2Fsvg%3E)
}

.perfundo__prev {
  left: 2em;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg)
}

.perfundo__next {
  right: 2em
}

.perfundo__untarget {
  position: fixed;
  top: 0
}

.perfundo__next,
.perfundo__prev {
  top: 50%;
  margin-top: -1.5em;
  opacity: .2;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2244.1%22%20height%3D%2294.7%22%20viewBox%3D%220%200%2044.1%2094.7%22%20enable-background%3D%22new%200%200%2044.088%2094.67%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M44.1%2047.3L1.5%2094.7%200%2093.3l41.4-46L0%201.3%201.5%200%2044.1%2047.3z%22%2F%3E%3C%2Fsvg%3E)
}

.perfundo__next:focus,
.perfundo__next:hover,
.perfundo__prev:focus,
.perfundo__prev:hover {
  opacity: 1
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

.perfundo__link {
  color: inherit !important;
}

.perfundo__overlay {
  z-index: 9999 !important;
}

.perfundo__image {
  background-size: contain !important;
  background-position: center !important;
  width: 800px !important;
  padding-top: 62.6% !important;
  background-repeat: no-repeat !important;
}

.perfundo__caption {
  text-align: center;
}